<template>
    <div class="payDetails-view">

      <modules-title titleName="已收费详情">

        <template slot="other">
          <div class="priceView">
            <div class="priceView-item">
              <span>总金额：¥{{datas.amount.toFixed(2)}}</span>
            </div>

            <div class="priceView-item">
              <span>优惠 ¥{{(datas.amount - datas.receipts_amount).toFixed(2)}}</span>
            </div>

            <div class="priceView-item">
              <span>实收：</span>
              <span class="price">¥{{datas.receipts_amount.toFixed(2)}}</span>
            </div>
<!--            <div class="priceView-item">-->
<!--              <span class="grayTitle">(微信付款)</span>-->
<!--            </div>-->
          </div>
        </template>
        <template slot="btn">
          <el-button class="main-btn" type="primary" @click="refundClick" v-if="datas.is_view_refund != 2">退费</el-button>
          <el-button class="border-btn" @click="printPrescri">打印处方</el-button>
          <el-button class="border-btn" @click="printBill">打印小票</el-button>
          <el-button class="border-btn" @click="backClick">返回</el-button>
        </template>
      </modules-title>


      <div class="scroll-view">

        <div class="payInformation" v-for="(record,index) in datas.charge_record">
          <div class="informationItem">
            <span class="grayTitle" v-if="record.option_type == 1">收费时间：</span>
            <span class="grayTitle" v-else>退费时间：</span>
            <span>{{record.created_at}}</span>
          </div>
          <div class="informationItem">
            <span class="grayTitle" v-if="record.option_type == 1">收费员：</span>
            <span class="grayTitle" v-else>退费员：</span>
            <span>{{record.user_name}}</span>
          </div>

          <div class="informationItem">
            <span class="grayTitle" v-if="record.option_type == 1">实收金额：</span>
            <span class="grayTitle" v-else>实退金额：</span>
            <span>¥{{record.receipts_amount.toFixed(2)}}</span>
          </div>

          <div class="informationItem">
            <span class="grayTitle" v-if="record.option_type == 1">付款类型：</span>
            <span class="grayTitle" v-else>退款类型：</span>
            <span v-if="record.pay_type == 1">现金</span>
            <span v-else-if="record.pay_type == 2">支付宝</span>
            <span v-else-if="record.pay_type == 3">微信支付</span>
            <span v-else-if="record.pay_type == 4">银行卡</span>
            <span v-else-if="record.pay_type == 5">医保卡</span>
          </div>

          <div class="informationItem" v-if="record.option_type == 2">
            <span class="grayTitle">备注：</span>
            <span>{{record.remark}}</span>
          </div>
        </div>

        <div class="patientView">

          <div class="title">诊断详情</div>

          <div class="bese-information">
            <div class="information-item">
              <span class="grayTitle">患者：</span>
              <span class="value">{{datas.real_name}}</span>
            </div>

            <div class="information-item">
              <span class="grayTitle">性别：</span>
              <span class="value" v-if="datas.gender == '0'">男</span>
              <span class="value" v-else-if="datas.gender == 1">女</span>
            </div>

            <div class="information-item">
              <span class="grayTitle">年龄：</span>
              <span class="value">{{datas.age | dealAge}}</span>
            </div>

            <div class="information-item">
              <span class="grayTitle">医生：</span>
              <span class="value">{{datas.doctor_name}}</span>
            </div>

            <div class="information-item" v-if="datas.department_name && datas.department_name != ''">
              <span class="grayTitle">科室：</span>
              <span class="value">{{datas.department_name}}</span>
            </div>

            <div class="information-item">
              <span class="grayTitle">就诊日期：</span>
              <span class="value" >{{datas.created_at}}</span>
            </div>

            <div class="information-item">
              <span class="grayTitle">就诊类型：</span>
              <span class="value" v-if="datas.medical_record_repeat == 2">复诊</span>
              <span class="value" v-else-if="datas.medical_record_repeat == 1">初诊</span>
              <span class="value" v-else>无</span>
            </div>
          </div>

          <div class="total-view">
            <div class="information-item">
              <span class="grayTitle">诊断：</span>
              <span class="value">{{datas.result}}</span>
            </div>
          </div>

          <div class="image-tag">
            <img src="../../../assets/img/payOrDrug/image_pay.png">
          </div>
        </div>

        <check-item v-if="datas.check_item  && datas.check_item.length > 0" :datas="datas.check_item"></check-item>

        <surcharge-item v-if="datas.surcharge  && datas.surcharge.length > 0" :datas="datas.surcharge"></surcharge-item>

        <prescription-item v-for="i in datas.prescription_ary_info" :method="datas.sell_method" :data="i"></prescription-item>
<!--         <div id="print">-->
<!--            <printClinc ></printClinc>-->
<!--         </div>-->

      </div>

      <print ref="print"></print>

    </div>
</template>

<script>
  import print from "../../print/print";
import printClinc from "../modules/print"
  import surchargeItem from "../modules/surchargeItem";
  import checkItem from "../modules/checkItem";
  import {medicineDetail} from "../../../api/payOrDrug";
  import prescriptionItem from "../modules/prescriptionItem";

    export default {
        name: "index",
        components:{prescriptionItem,checkItem,surchargeItem,printClinc,print},
        data:function () {
            return{
                value:'',
                checked:false,
                list:[1,2,3],
                preferentialValue:0,
                datas:{
                    amount:0,
                    receipts_amount:0,
                    created_at:'',
                    age:''
                },
                caseHistoryDetail:{},
            }
        },
        mounted:function(){
            if (this.$route.query.id){
                this.getData(this.$route.query.id)
            }
        },
        methods:{
            refundClick:function () {
                this.$router.push({name:"addRefund",query:{id:this.$route.query.id}})
            },
            getData:function (id) {
                medicineDetail(id,1).then((res)=>{
                    if (res.code == 200){
                        this.datas = res.data;
                    }
                })
            },
            backClick:function () {
                this.$router.back()
            },
            printPrescri:function () {
                this.caseHistoryDetail = {...this.datas};
                // this.caseHistoryDetail.created_at = this.caseHistoryDetail.detail_at
                this.caseHistoryDetail.prescriptions = this.caseHistoryDetail.prescription_ary_info;
                this.caseHistoryDetail.check_items = this.caseHistoryDetail.check_item;
                this.caseHistoryDetail.ID = this.caseHistoryDetail.medical_record_id;
                this.caseHistoryDetail.medical_repeat = this.caseHistoryDetail.medical_record_repeat
                this.$refs.print.printPrescription(this.caseHistoryDetail)
                // setTimeout(()=>{
                //     this.$refs.prescriptionPrint.print()
                // },500)

            },
            printBill:function () {
                let data = {...this.datas}
                data.created_at = data.detail_at
                this.$refs.print.printBill(data)
            }
        }
    }
</script>

<style lang="scss" scoped>
  @import "@/assets/scss/payOrDrug/payDetails.scss";
</style>
